<template>
	<view class="smart-panel-head">
		<view class="smart-panel-h" @click="goDetailPage('tests1')">tests1视图</view>
			<view v-if="!sunny">下雨天不出门</view>
			<view v-if="sunny">晴天就出门</view>
			<view v-if="state === 'vue'">state值:Vue</view>
			<view>State is {{ state ? 'vue' : 'app' }}</view>
			<view>
				<view v-if="state === 'vue'">Uni-App</view>
				<view v-else-if="state === 'html'"> HTML</view>
				<view v-else> App</view>
			</view>

			<view v-for="(item, index) in 4" style="color: aquamarine;">
				<view :class="'list-' + index%2">{{ index%2 }}</view>
			</view>
			<view v-for="(value,name, index) in object">
				{{ index }}.{{ name }}: {{ value }}
			</view>
			<view v-for="item in arr" :key="item.id">
				<view style="color: #0000ff;">{{ item.id }}:{{ item.name }}</view>
			</view>
	</view>
</template>
<script>
	export default {
		data() {
			return {
				sunny:true,
				state:'vue',
				arr:[
					{id:1,name:'UniApp'},
					{id:2,name:'HTML'}
				],
				object:{
					title:"How to lists?",
					author:"hhl",
					publishedAt:'2004-11-21'
				}
			}
		},
		methods: {
			
		}
	}
</script>

<style>

</style>